﻿<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:prop="clr-namespace:Citrix.XaAdminMobile.Properties"
                    xmlns:local="clr-namespace:Citrix.XaAdminMobile"
                    xmlns:vm="clr-namespace:Citrix.XaAdminMobile.ViewModel"
                    xmlns:sys="clr-namespace:System;assembly=mscorlib"
                    xmlns:cmp="clr-namespace:Citrix.Cmp;assembly=Citrix.Cmp.Wpf">

  <!--=========================================================================================-->
  <!-- General app resources -->
  <LinearGradientBrush x:Key="ActiveSelectionHighlight" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF819CC2" Offset="0"/>
    <GradientStop Color="#FF5275A5" Offset="1"/>
    <GradientStop Color="#FF5E84B8" Offset="0.5"/>
    <GradientStop Color="#FF678CBC" Offset="0.49"/>
  </LinearGradientBrush>
  
  <SolidColorBrush x:Key="BubbleBackgroundBrush" Color="#FFC4C4C4"/>

  <!-- Reset button background brush. -->
  <LinearGradientBrush x:Key="ResetBackground" StartPoint="0.5,0" EndPoint="0.5,1">
    <GradientStop Color="#FF990000" Offset="1"/>
    <GradientStop Color="#FFBE3535" Offset="0.502"/>
    <GradientStop Color="#FFD07676" Offset="0.49"/>
    <GradientStop Color="#FFDC8686"/>
  </LinearGradientBrush>


  <!--=========================================================================================-->
  <!-- Toolbar resources -->

  <GridLength x:Key="ToolbarHeight">44</GridLength>
  <sys:Double x:Key="ToolbarHeightAsDouble">44</sys:Double>

  <LinearGradientBrush x:Key="ToolbarBrush" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF929395" Offset="0"/>
    <GradientStop Color="#FF4C4D50" Offset="0.5"/>
    <GradientStop Color="#FF363739" Offset="1"/>
    <GradientStop Color="#FF5F6062" Offset="0.49"/>
  </LinearGradientBrush>

  <Style x:Key="ToolbarBorderStyle" TargetType="Border">
    <Setter Property="Height" Value="{StaticResource ToolbarHeightAsDouble}"/>
    <Setter Property="Background" Value="{StaticResource ToolbarBrush}"/>
  </Style>

  <Style x:Key="ToolbarTitleTextEmbossStyle" TargetType="TextBlock">
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="FontSize" Value="20"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="VerticalAlignment" Value="Center"/>
    <Setter Property="TextTrimming" Value="CharacterEllipsis"/>
    <Setter Property="Effect">
      <Setter.Value>
        <DropShadowEffect BlurRadius="0" Color="DarkGray" Direction="90" ShadowDepth="1"/>
      </Setter.Value>
    </Setter>
  </Style>

  <!-- The data template for the master navigation toolbar used on multiple pages. -->
  <DataTemplate DataType="{x:Type vm:NavToolbarViewModel}">
    <Border Style="{DynamicResource ToolbarBorderStyle}">
      <Grid>
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="*"/>
          <ColumnDefinition Width="Auto"/>
          <ColumnDefinition Width="*"/>
          <ColumnDefinition Width="Auto"/>
          <ColumnDefinition Width="*"/>
          <ColumnDefinition Width="Auto"/>
          <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Button Style="{DynamicResource NakedButtonStyle}"
                Command="{Binding PowerCommand}">
          <Path Style="{DynamicResource PowerIconStyle}"/>
        </Button>
        <Rectangle Grid.Column="1" Fill="LightGray" Width="1"/>

        <Button x:Name="ServersButton" Grid.Column="2" Content="{x:Static prop:Resources.ServersTag}"
                Style="{DynamicResource NakedButtonStyle}" Padding="0"
                FontSize="16" Command="{Binding ServersCommand}"/>
        <Rectangle Grid.Column="3" Fill="LightGray" Width="1"/>

        <Button x:Name="SessionsButton" Grid.Column="4" Content="{x:Static prop:Resources.SessionsTag}"
                Style="{DynamicResource NakedButtonStyle}" Padding="0"
                FontSize="16" Command="{Binding SessionsCommand}"/>
        <Rectangle Grid.Column="5" Fill="LightGray" Width="1"/>

        <Button x:Name="SettingsButtons" Grid.Column="6" Style="{DynamicResource NakedButtonStyle}"
                Command="{Binding SettingsCommand}">
          <Rectangle Fill="{DynamicResource SettingsBrush}"
                     HorizontalAlignment="Center" VerticalAlignment="Center"
                     Width="20" Height="20" Margin="15,0"/>
        </Button>

      </Grid>
    </Border>
    
    <!-- Triggers to show a highlight on the button associated with the active page -->
    <DataTemplate.Triggers>
      <DataTrigger Binding="{Binding IsServerPageActive}" Value="True">
        <Setter TargetName="ServersButton" Property="Background" Value="{DynamicResource ActiveSelectionHighlight}" />
      </DataTrigger>
      <DataTrigger Binding="{Binding IsSessionsPageActive}" Value="True">
        <Setter TargetName="SessionsButton" Property="Background" Value="{DynamicResource ActiveSelectionHighlight}" />
      </DataTrigger>
      <DataTrigger Binding="{Binding IsSettingsPageActive}" Value="True">
        <Setter TargetName="SettingsButtons" Property="Background" Value="{DynamicResource ActiveSelectionHighlight}" />
      </DataTrigger>
    </DataTemplate.Triggers>
  </DataTemplate>

  <!--=========================================================================================-->
  <!-- Style for drawing separator lines. -->

  <Style x:Key="RectangleSeparatorStyle" TargetType="{x:Type Rectangle}">
    <Setter Property="SnapsToDevicePixels" Value="True" />
    <Setter Property="Fill" Value="LightGray" />
    <Setter Property="Height" Value="{DynamicResource {x:Static cmp:DpiScaling.DeviceDependentSeparatorHeightKey}}" />
  </Style>

  <!--==========================================================================================-->
  <!-- A simple button with no frame - it just appears as content over the background. It provides
    a selection highlight when the button is pressed. -->
  <Style x:Key="NakedButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="5"/>
    <Setter Property="FontSize" Value="12"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Grid>
            <!-- Transparent surface to give the button a full rectangular hit area and display
              a selection highlight. -->
            <Rectangle x:Name="Highlight" Fill="{DynamicResource ActiveSelectionHighlight}" Opacity="0"/>
            <ContentPresenter
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsEnabled" Value="false">
              <Setter Property="Foreground" Value="DarkGray"/>
            </Trigger>
            <Trigger Property="IsPressed" Value="True">
              <Setter TargetName="Highlight" Property="Opacity" Value="100" />
              <Trigger.ExitActions>
                <BeginStoryboard>
                  <Storyboard>
                    <DoubleAnimation
                        Storyboard.TargetName="Highlight" Storyboard.TargetProperty="Opacity"
                        From="100" To="0" Duration="0:0:0.5" FillBehavior="Stop" />
                  </Storyboard>
                </BeginStoryboard>
              </Trigger.ExitActions>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Custom listbox and listbox item styles. -->

  <!-- We override the default list box item template to use our skinned colours. We also add a
    default separator line. -->
  <Style x:Key="{x:Type ListBoxItem}" TargetType="{x:Type ListBoxItem}">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBoxItem}">
          <Grid>
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto"/>
              <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <!-- The border provides the selection highlight. -->
            <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}"
                    SnapsToDevicePixels="true">
              <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>

            <!-- Separator line -->
            <Rectangle Grid.Row="1" Style="{DynamicResource RectangleSeparatorStyle}"/>
          </Grid>
          <ControlTemplate.Triggers>
            <!-- Selected and has focus -->
            <Trigger Property="IsSelected" Value="true">
              <Setter Property="Background" TargetName="Bd" Value="{DynamicResource ActiveSelectionHighlight}"/>
              <Setter Property="Foreground" Value="White"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!-- A custom listbox style that removes the listbox item highlight. We generally don't use
  the listbox selection mechanism, so we don't want the listbox selection triggering any
  highlights to be drawn. -->
  <Style x:Key="NoSelectionListBoxItem" TargetType="{x:Type ListBoxItem}">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBoxItem}">
          <Grid>
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto"/>
              <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}"
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
              <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>

            <!-- Separator line -->
            <Rectangle x:Name="separator" Grid.Row="1" Style="{DynamicResource RectangleSeparatorStyle}"/>
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
  
  <!-- A variant which doesn't show a separator after the last item in the list. -->
  <Style x:Key="NoLastSeparatorListBoxItem" TargetType="{x:Type ListBoxItem}">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBoxItem}">
          <Grid>
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto"/>
              <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <!-- Separator line. -->
            <Rectangle x:Name="separator" Style="{DynamicResource RectangleSeparatorStyle}"/>

            <!-- The border provides the selection highlight. -->
            <Border x:Name="Bd" Grid.Row="1" BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
              <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>

          </Grid>
          <ControlTemplate.Triggers>
            <!-- Selected and has focus -->
            <Trigger Property="IsSelected" Value="true">
              <Setter Property="Background" TargetName="Bd" Value="{DynamicResource ActiveSelectionHighlight}"/>
              <Setter Property="Foreground" Value="White"/>
            </Trigger>
            <!-- Hides the separator for the first item. -->
            <DataTrigger Binding="{Binding RelativeSource={RelativeSource PreviousData}}" Value="{x:Null}">
              <Setter Property="Visibility" TargetName="separator" Value="Collapsed"/>
            </DataTrigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>  

  <!-- Custom style that removes the visible border and shows a no items prompt when empty. -->
  <Style x:Key="CleanListboxStyle" TargetType="{x:Type ListBox}">
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
    <Setter Property="ScrollViewer.PanningMode" Value="Both"/>
    <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBox}">
          <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="true">

            <Grid>
              <ScrollViewer x:Name="ScrollViewer" Focusable="false" Padding="{TemplateBinding Padding}">
                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
              </ScrollViewer>

              <!-- The no items prompt, made visible when the list is not empty. -->
              <TextBlock x:Name="NoItemsPrompt" Text="{x:Static prop:Resources.ListboxEmptyPrompt}" Visibility="Collapsed"
                           HorizontalAlignment="Center" VerticalAlignment="Center"
                           Margin="20,0" FontSize="16" Foreground="Gray"/>

            </Grid>
          </Border>
          <ControlTemplate.Triggers>
            <Trigger Property="IsGrouping" Value="true">
              <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
            </Trigger>
            <!-- Shows the empty prompt when there are no items in the list. -->
            <Trigger Property="HasItems" Value="False">
              <Setter TargetName="ScrollViewer" Property="Visibility" Value="Collapsed"/>
              <Setter TargetName="NoItemsPrompt" Property="Visibility" Value="Visible"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Custom scrollbar resources -->

  <!-- Misc constants consumed in the scrollbar template/style definition. -->
  <sys:Double x:Key="ScrollbarWidth">4</sys:Double>
  <GridLength x:Key="ScrollbarWidthAsGridLength">4</GridLength>
  <CornerRadius x:Key="ScrollbarSliderCornerRadius">2</CornerRadius>
  <SolidColorBrush x:Key="ScrollbarBackgroundBrush">#00000000</SolidColorBrush>
  <SolidColorBrush x:Key="ScrollbarSliderBrush">#88000000</SolidColorBrush>

  <!-- Style for the slider in a scrollbar. -->
  <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
    <Setter Property="IsTabStop" Value="false"/>
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Thumb}">
          <Border x:Name="Border"
                    CornerRadius="{DynamicResource ScrollbarSliderCornerRadius}"
                    Background="{DynamicResource ScrollbarSliderBrush}">
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!-- Above and below the slider is the "background" of the scrollbar. You can click on this
    background to trigger per-page scrolling. This background is in fact one of these buttons. We
    display one of these transparent buttons above and below the slider to get the per-page
    scrolling behaviour when this area is clicked. -->
  <Style x:Key="ScrollBarPageButton" TargetType="{x:Type RepeatButton}">
    <Setter Property="IsTabStop" Value="false"/>
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type RepeatButton}">
          <Border Background="Transparent" />
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!-- This style sets our custom scroll bar as the default scroll bar style for the entire
    application. -->
  <Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="Width" Value="{DynamicResource ScrollbarWidth}"/>
    <Setter Property="MinWidth" Value="{DynamicResource ScrollbarWidth}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ScrollBar}">
          <Grid>
            <Border CornerRadius="{DynamicResource ScrollbarSliderCornerRadius}"
                      Background="{DynamicResource ScrollbarBackgroundBrush}" />
            <Track Name="PART_Track" IsDirectionReversed="true">
              <Track.DecreaseRepeatButton>
                <RepeatButton Style="{DynamicResource ScrollBarPageButton}"/>
              </Track.DecreaseRepeatButton>
              <Track.Thumb>
                <Thumb Style="{DynamicResource ScrollBarThumb}" />
              </Track.Thumb>
              <Track.IncreaseRepeatButton>
                <RepeatButton Style="{DynamicResource ScrollBarPageButton}"/>
              </Track.IncreaseRepeatButton>
            </Track>
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
    <Style.Triggers>
      <Trigger Property="Orientation" Value="Horizontal">
        <Setter Property="Width" Value="Auto"/>
        <Setter Property="MinWidth" Value="0"/>
        <Setter Property="Height" Value="{DynamicResource ScrollbarWidth}"/>
        <Setter Property="MinHeight" Value="{DynamicResource ScrollbarWidth}"/>
        <Setter Property="Template">
          <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollBar}">
              <Grid>
                <Border CornerRadius="{DynamicResource ScrollbarSliderCornerRadius}"
                          Background="{DynamicResource ScrollbarBackgroundBrush}" />
                <Track Name="PART_Track" IsDirectionReversed="false">
                  <Track.DecreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBarPageButton}"/>
                  </Track.DecreaseRepeatButton>
                  <Track.Thumb>
                    <Thumb Style="{DynamicResource ScrollBarThumb}" />
                  </Track.Thumb>
                  <Track.IncreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBarPageButton}"/>
                  </Track.IncreaseRepeatButton>
                </Track>
              </Grid>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Trigger>
    </Style.Triggers>
  </Style>

  <SolidColorBrush x:Key="PageScrollStrokeBrush" Color="#FFEEEEEE"/>

  <!-- Page scroll button path styles. -->
  <Style x:Key="UpArrowStyle" TargetType="{x:Type Path}">
    <Setter Property="Data" Value="M0,20 L20,0 40,20 32,20 32,40 8,40 8,20 z"/>
    <Setter Property="Fill" Value="Transparent"/>
    <Setter Property="Stroke" Value="{StaticResource PageScrollStrokeBrush}"/>
    <Setter Property="Effect">
      <Setter.Value>
        <DropShadowEffect BlurRadius="2" Color="#FFDEDEDE" ShadowDepth="1"/>
      </Setter.Value>
    </Setter>
  </Style>
  <Style x:Key="RightArrowStyle" TargetType="{x:Type Path}" BasedOn="{StaticResource UpArrowStyle}">
    <Setter Property="Effect">
      <Setter.Value>
        <DropShadowEffect BlurRadius="2" Color="#FFDEDEDE" ShadowDepth="1" Direction="90"/>
      </Setter.Value>
    </Setter>
    <Setter Property="LayoutTransform">
      <Setter.Value>
        <RotateTransform Angle="90"/>
      </Setter.Value>
    </Setter>
  </Style>
  <Style x:Key="DownArrowStyle" TargetType="{x:Type Path}">
    <Setter Property="Data" Value="M8,0 L32,0 32,20 40,20 20,40 0,20 8,20 z"/>
    <Setter Property="Fill" Value="Transparent"/>
    <Setter Property="Stroke" Value="{StaticResource PageScrollStrokeBrush}"/>
    <Setter Property="Effect">
      <Setter.Value>
        <DropShadowEffect BlurRadius="2" Color="#FFDEDEDE" ShadowDepth="1"/>
      </Setter.Value>
    </Setter>
  </Style>
  <Style x:Key="LeftArrowStyle" TargetType="{x:Type Path}" BasedOn="{StaticResource DownArrowStyle}">
    <Setter Property="Effect">
      <Setter.Value>
        <DropShadowEffect BlurRadius="2" Color="#FFDEDEDE" ShadowDepth="1" Direction="90"/>
      </Setter.Value>
    </Setter>
    <Setter Property="LayoutTransform">
      <Setter.Value>
        <RotateTransform Angle="90"/>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Custom scroll viewer that overlays the the scroll bars over the content to save on
    space. -->
  <Style x:Key="{x:Type ScrollViewer}" TargetType="{x:Type ScrollViewer}">
    <Setter Property="OverridesDefaultStyle" Value="True" />
    <Setter Property="cmp:KineticScrollingBehaviour.HandleKineticScrolling" Value="True"/>
    <Setter Property="cmp:KineticScrollingBehaviour.Friction" Value="0.92"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ScrollViewer}">
          <Grid>

            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="*"/>
              <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
              <RowDefinition Height="*"/>
              <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <ScrollContentPresenter x:Name="PART_ScrollContentPresenter"
                                      Grid.Column="0" Grid.Row="0"
                                      Grid.ColumnSpan="2" Grid.RowSpan="2"
                                      Margin="{TemplateBinding Padding}" 
                                      Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      CanContentScroll="{TemplateBinding CanContentScroll}"
                                      CanHorizontallyScroll="False" CanVerticallyScroll="False"/>
            <ScrollBar Orientation="Vertical" Grid.Row="0" Grid.Column="1"
                         Cursor="Arrow"
                         Maximum="{TemplateBinding ScrollableHeight}" Minimum="0"
                         Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                         ViewportSize="{TemplateBinding ViewportHeight}"
                         Name="PART_VerticalScrollBar"
                         Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                         AutomationProperties.AutomationId="VerticalScrollBar"/>
            <ScrollBar Orientation="Horizontal" Grid.Row="1" Grid.Column="0"
                         Cursor="Arrow"
                         Maximum="{TemplateBinding ScrollableWidth}" Minimum="0"
                         Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                         ViewportSize="{TemplateBinding ViewportWidth}"
                         Name="PART_HorizontalScrollBar"
                         Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                         AutomationProperties.AutomationId="HorizontalScrollBar"/>

            <!-- Page scroll buttons. -->
            <Grid HorizontalAlignment="Right" VerticalAlignment="Bottom">
              <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
              </Grid.RowDefinitions>

              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
              </Grid.ColumnDefinitions>

              <!-- Page Up button -->
              <Button Grid.Column="2" Command="{x:Static ScrollBar.PageUpCommand}"
                        Style="{DynamicResource NakedButtonStyle}" Padding="2,5"
                        Visibility="{Binding ElementName=PART_VerticalScrollBar, Path=Visibility}">
                <Path Style="{StaticResource UpArrowStyle}"/>
              </Button>

              <!-- Page Down button -->
              <Button Grid.Column="2" Grid.Row="1" Command="{x:Static ScrollBar.PageDownCommand}"
                        Style="{DynamicResource NakedButtonStyle}" Padding="2,5"
                        Visibility="{Binding ElementName=PART_VerticalScrollBar, Path=Visibility}">
                <Path Style="{StaticResource DownArrowStyle}"/>
              </Button>

              <!-- Page Left button -->
              <Button Grid.Column="0" Grid.Row="1" Command="{x:Static ScrollBar.PageLeftCommand}"
                        Style="{DynamicResource NakedButtonStyle}" Padding="5,2"
                        Visibility="{Binding ElementName=PART_HorizontalScrollBar, Path=Visibility}">
                <Path Style="{StaticResource LeftArrowStyle}"/>
              </Button>

              <!-- Page Right button -->
              <Button Grid.Column="1" Grid.Row="1" Command="{x:Static ScrollBar.PageRightCommand}"
                        Style="{DynamicResource NakedButtonStyle}" Padding="5,2"
                        Visibility="{Binding ElementName=PART_HorizontalScrollBar, Path=Visibility}">
                <Path Style="{StaticResource RightArrowStyle}"/>
              </Button>

            </Grid>
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Custom mobile friendly checkbox. -->
  <Style x:Key="ChunkyCheckBoxStyle" TargetType="{x:Type CheckBox}">
    <Setter Property="FontSize" Value="18"/>
    <Setter Property="Padding" Value="10"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type CheckBox}">
          <ControlTemplate.Resources>

            <DrawingBrush x:Key="TickBrush" Stretch="Uniform">
              <DrawingBrush.Drawing>
                <DrawingGroup>
                  <DrawingGroup.Children>
                    <GeometryDrawing Brush="#FF5275A5" Geometry="F1 M 5.04509,11.2657L 0,7.76942L 1.55231,5.82708L 4.65697,8.93484C 4.65697,8.93484 9.02296,0.87405 11.2545,-3.8147e-006L 13.583,2.33082C 13.583,2.33082 9.02296,4.07895 5.04509,11.2657 Z "/>
                  </DrawingGroup.Children>
                </DrawingGroup>
              </DrawingBrush.Drawing>
            </DrawingBrush>

            <sys:Double x:Key="BorderSize">26</sys:Double>
          </ControlTemplate.Resources>

          <Grid>
            <!-- Provides the target for drawing highlights, as well as ensuring the full area
            is available for hit testing. -->
            <Rectangle x:Name="Background" Fill="Transparent"/>

            <!-- We place the main layout in a separate grid so we have a top level element to
            apply the padding to. -->
            <Grid Margin="{TemplateBinding Padding}">
              
              <Grid.ColumnDefinitions>
                <!-- The check/tick -->
                <ColumnDefinition Width="Auto"/>
                <!-- Margin between check and content. -->
                <ColumnDefinition Width="10"/>
                <!-- Content presenter -->
                <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>

              <!-- The "check". We display a border with a tick inside it. -->
              <Border Width="{StaticResource BorderSize}" Height="{StaticResource BorderSize}"
                CornerRadius="3" BorderBrush="Gray" BorderThickness="1"
                SnapsToDevicePixels="True"
                HorizontalAlignment="Left">
                <Border.Background>
                  <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFD3D0D0" Offset="0"/>
                    <GradientStop Color="White" Offset="1"/>
                  </LinearGradientBrush>
                </Border.Background>

                <Rectangle x:Name="TheCheck" Fill="{StaticResource TickBrush}" Margin="3" Visibility="Hidden" />

              </Border>

              <!-- Content presenter. -->
              <ContentPresenter Grid.Column="2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                Content="{TemplateBinding Content}"
                                ContentStringFormat="{TemplateBinding ContentStringFormat}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                RecognizesAccessKey="True" VerticalAlignment="Center"/>

            </Grid>
          </Grid>
          <ControlTemplate.Triggers>
            <Trigger Property="IsChecked" Value="True">
              <Setter TargetName="TheCheck" Property="Visibility" Value="Visible"/>
            </Trigger>
            <Trigger Property="IsEnabled" Value="False">
              <Setter TargetName="Background" Property="Fill" Value="LightGray"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <!-- Defines a TextBox without border. -->
  <Style x:Key="NoBorderTextBoxStyle" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">
    <Setter Property="Padding" Value="1"/>
    <Setter Property="AllowDrop" Value="true"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type TextBox}">
          <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!--=========================================================================================-->
  <DataTemplate DataType="{x:Type vm:SearchTriggerViewModel}">
    <Button Command="{Binding ActivateCommand}">
      <Button.Template>
        <ControlTemplate>
          <Grid Height="{DynamicResource ToolbarHeightAsDouble}">
            <Rectangle Fill="#FFC2C2C2"/>

            <Border Margin="5" CornerRadius="15" Background="White">
              <TextBlock Margin="15,0" VerticalAlignment="Center" FontSize="18"
                           Foreground="#FFC2C2C2" Text="{x:Static prop:Resources.SearchPrompt}"/>
            </Border>
          </Grid>
        </ControlTemplate>
      </Button.Template>
    </Button>
  </DataTemplate>

</ResourceDictionary>